<template>
  <div style="background-color: var(--color-bg-F6);">
    <!-- 固定头部 -->
    <div class="show-pc">
      <div>
        <PCHeadLayout class="head" />

      </div>
      <!-- 内容区域 - 添加内边距 -->
      <div class="content-wrapper">
        <slot />
        <FloatGroup />
      </div>

    </div>




    <div class="show-wap">
      <div>
        <PCHeadLayout class="head-wap" />

      </div>


      <div class="content-wrapper-wap">
        <slot />
        <FloatGroup />
      </div>
    </div>


  </div>
</template>

<script setup>
import PCHeadLayout from './components/pc/HeadLayout.vue'
import FloatGroup from './components/pc/FloatGroup.vue'
</script>

<style lang="less" scoped>
.head {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background-color: var(--color-bg-F6);
}

/* 新增内容容器样式 */
.content-wrapper {
  padding-top: 3.62vw;
  min-height: calc(100vh - 3.62vw);
}


.head-wap {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  z-index: 1000;
  background-color: var(--color-bg-F6);
}


.content-wrapper-wap {
  padding-top: 70px;
  min-height: calc(100vh - 70px);
}
</style>